<!doctype html>
<html class="no-js" lang="">

<head>
    <!-- meta -->
    <meta charset="utf-8">
    <meta name="description" content="Flat, Clean, Responsive, admin template built with bootstrap 3">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
    <!-- /meta -->

    <title>心秘籍系统</title>



    <!-- core styles -->
    <link rel="stylesheet" href="__ROOT__/Public/asset/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="__ROOT__/Public/asset/css/font-awesome.min.css">
    <link rel="stylesheet" href="__ROOT__/Public/asset/css/animate.min.css">
    <!-- /core styles -->

    <!-- template styles -->
    <link rel="stylesheet" href="__ROOT__/Public/asset/css/style.1.css" id="font">

    <!-- template styles -->
    <link rel="stylesheet" href="__PUBLIC__/css/userQuizReport.css">
    <link rel="stylesheet" href="__PUBLIC__/css/wippf/wippf.css">

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

    <script src="__ROOT__/Public/asset/vendor/modernizr.js"></script>
</head>

<!-- body -->
<body>
<div id="canvas_area">


</div>

<div class="container">

    <header class="col-md-8 col-md-offset-2">
        <div class="title">
            <h2 align="center"><b>威斯巴登积极心理治疗和家庭治疗调查表分析报告</b></h2>
            <br><br><br>
            <h4 align="center" style="font-family: 微软雅黑;">原著：Wiesbadener</h4>
        </div>
    </header>
    <div class="col-md-10 col-md-offset-1"><hr/></div>
    <div class="col-md-6 col-md-offset-3"><p align="center">受测者：{$userinfo.username}&nbsp&nbsp&nbsp</p></div>
    <div class="col-md-10 col-md-offset-1 menu">
        <table width="100%">
            <tbody>
            <tr><td class="line"><div class="l b">wippf测试结果</div> <div class="r">1</div></td></tr>

            </tbody>
        </table>
    </div>
    <div class="col-md-10 col-md-offset-1">
        <div class="main-header">测验背景介绍</div>

        <article><p>
            WIPPF是威斯巴登积极心理人格能力调查表的缩写，是积极心理治疗的核心调查量表，它可以在一张表内测量出你的：
            19项能力所在
            冲突反应模式（面对压力和冲突时的反应倾向性）
            榜样模型（母亲、父亲、他人以及关系）
            社会行为倾向
            情感关系特点
            增强对自己的深入了解、进行深入自我挖掘的必备工具，如果和伙伴共同测试，更能看到双方的共同点、差异和分歧。</p>
        </article>
    </div>


    <div class="col-md-10 col-md-offset-1">
        <div class="main-header">该受测者的整体情况</div>

        <div class="wippf_table">

            <table class="table table-bordered ">
                <thead>
                <tr>
                    <td colspan="2">被测者用户名：</td>
                    <td colspan="2">性别：男</td>
                    <td colspan="4">年龄：xx</td>
                    <td colspan="11">测试标题</td>

                </tr>
                <tr>
                    <td colspan="4"><b>WIPPF 2.0</b></td>
                    <td colspan="3" align="center">Min</td>
                    <td colspan="4" align="center">Medium</td>
                    <td colspan="3" align="center">Max</td>
                    <td colspan="4"></td>
                </tr>

                <tr>
                    <td colspan="1"></td>
                    <td colspan="1"><b>继发能力</b></td>
                    <td colspan="1"><b>得分</b></td>
                    <td colspan="1">低特质</td>
                    <td colspan="1">3</td>
                    <td colspan="1">4</td>
                    <td colspan="1">5</td>
                    <td colspan="1">6</td>
                    <td colspan="1">7</td>
                    <td colspan="1">8</td>
                    <td colspan="1">9</td>
                    <td colspan="1">10</td>
                    <td colspan="1">11</td>
                    <td colspan="1">12</td>
                    <td colspan="1">高特质</td>
                </tr>

                </thead>
                <tbody>
                    <!--表格area_0-->
                    <foreach name="wippf_resultTable0" item="table_row">
                            <tr>
                                <td class="td_index">{$table_row.element_index}</td>
                                <td class="td_name">{$table_row.element_name}</td>
                                <td class="td_score">{$table_row.row_score}</td>
                                <td>{$table_row.desc_level1}</td>

                                <foreach name="table_row['score_section']" item="score_td">
                                    <td class="td_score_0">{$score_td}</td>
                                </foreach>

                                <td>{$table_row.desc_level2}</td>
                            </tr>


                    </foreach>
                    <!--/表格area_0-->
                    <tr>
                        <td></td>

                        <td><b>原发能力</b></td>
                        <td>Σ</td>
                        <td></td>
                        <td colspan="1">3</td>
                        <td colspan="1">4</td>
                        <td colspan="1">5</td>
                        <td colspan="1">6</td>
                        <td colspan="1">7</td>
                        <td colspan="1">8</td>
                        <td colspan="1">9</td>
                        <td colspan="1">10</td>
                        <td colspan="1">11</td>
                        <td colspan="1">12</td>
                        <td colspan="1"><b></b></td>

                    </tr>
                    <!--表格area_1-->
                    <foreach name="wippf_resultTable1" item="table_row">
                        <tr>
                            <td class="td_index">{$table_row.element_index}</td>
                            <td class="td_name">{$table_row.element_name}</td>
                            <td class="td_score">{$table_row.row_score}</td>
                            <td>{$table_row.desc_level1}</td>

                            <foreach name="table_row['score_section']" item="score_td">
                                <td class="td_score_1">{$score_td}</td>
                            </foreach>

                            <td>{$table_row.desc_level2}</td>
                        </tr>


                    </foreach>

                    <!--/表格area_1-->
                    <tr>
                        <td></td>

                        <td><b>冲突反应</b></td>
                        <td>Σ</td>
                        <td>低特质</td>
                        <td colspan="1">3</td>
                        <td colspan="1">4</td>
                        <td colspan="1">5</td>
                        <td colspan="1">6</td>
                        <td colspan="1">7</td>
                        <td colspan="1">8</td>
                        <td colspan="1">9</td>
                        <td colspan="1">10</td>
                        <td colspan="1">11</td>
                        <td colspan="1">12</td>
                        <td colspan="1">高特质</td>

                    </tr>
                    <!--表格area_2-->
                    <foreach name="wippf_resultTable2" item="table_row">
                        <tr>
                            <td class="td_index">{$table_row.element_index}</td>
                            <td class="td_name">{$table_row.element_name}</td>
                            <td class="td_score">{$table_row.row_score}</td>
                            <td>{$table_row.desc_level1}</td>

                            <foreach name="table_row['score_section']" item="score_td">
                                <td class="td_score_2">{$score_td}</td>
                            </foreach>

                            <td>{$table_row.desc_level2}</td>
                        </tr>


                    </foreach>
                    <!--/表格area_2-->
                    <tr>
                        <td></td>

                        <td><b>榜样模型</b></td>
                        <td>Σ</td>
                        <td>低特质</td>
                        <td colspan="1">3</td>
                        <td colspan="1">4</td>
                        <td colspan="1">5</td>
                        <td colspan="1">6</td>
                        <td colspan="1">7</td>
                        <td colspan="1">8</td>
                        <td colspan="1">9</td>
                        <td colspan="1">10</td>
                        <td colspan="1">11</td>
                        <td colspan="1">12</td>
                        <td colspan="1">高特质</td>

                    </tr>
                    <!--表格area_2-->
                    <foreach name="wippf_resultTable3" item="table_row">
                        <tr>
                            <td class="td_index">{$table_row.element_index}</td>
                            <td class="td_name">{$table_row.element_name}</td>
                            <td class="td_score">{$table_row.row_score}</td>
                            <td>{$table_row.desc_level1}</td>

                            <foreach name="table_row['score_section']" item="score_td">
                                <td class="td_score_3">{$score_td}</td>
                            </foreach>

                            <td>{$table_row.desc_level2}</td>
                        </tr>


                    </foreach>
                    <!--/表格area_2-->
                </tbody>


            </table>

            <table class="table ">
                <thead>
                    <tr>
                        <td colspan="3" class="thead_social" style="border: 1px solid #ddd"><b>社会行为</b></td>
                        <td colspan="1" style="border-top: 1px solid #ddd">得分</td>
                        <td colspan="4" style="border-top: 1px solid #ddd">11</td>
                        <td colspan="4" style="border-top: 1px solid #ddd">15</td>
                        <td colspan="4" style="border-top: 1px solid #ddd">19</td>
                        <td colspan="4" style="border-top: 1px solid #ddd">23</td>
                        <td colspan="4" style="border-top: 1px solid #ddd">27</td>
                        <td colspan="4" style="border-top: 1px solid #ddd">31</td>
                        <td colspan="4" style="border-top: 1px solid #ddd">35</td>
                        <td colspan="3" style="border-top: 1px solid #ddd">39</td>
                        <td colspan="3" style="border-top: 1px solid #ddd">44</td>
                        <td colspan="3" style="border: 1px solid #ddd"></td>
                    </tr>
                </thead>
                <tbody>
                <!--因素二区域0-->
                <foreach name="wippf_resultTable_section2_0" item="table_row">
                    <tr>
                        <td class="td_section2_answer"  style="border: 1px solid #ddd; width: 5%">{$table_row.element_index}</td>
                        <td class="td_section2_answer" style="border: 1px solid #ddd">{$table_row.element_name}</td>
                        <td class="td_section2_answer" style="border: 1px solid #ddd">{$table_row.desc_level1}</td>
                        <td class="td_section2_answer" style="border: 1px solid #ddd">{$table_row.row_score}</td>

                        <foreach name="table_row['score_section']" item="score_td">
                            <td class="td_section2_score_0" style="padding: 7px 1px 1px 1px; border-bottom: 1px solid #ddd" align="center ">{$score_td}</td>
                        </foreach>
                        <td class="td_section2_pname" style="border: 1px solid #ddd">{$table_row.desc_level2}</td>
                        <td class="td_section2_pname" style="border: 1px solid #ddd; width: 5%">{$table_row.element_index}</td>

                    </tr>
                </foreach>
                <!--/因素二区域0-->
                </tbody>

            </table>


            <table class="table">
                <thead>
                <tr>
                    <td colspan="3" class="thead_social" style="border: 1px solid #ddd"><b>情感关系</b></td>
                    <td colspan="1" style="border-top: 1px solid #ddd">得分</td>
                    <td colspan="4" style="border-top: 1px solid #ddd">8</td>
                    <td colspan="4" style="border-top: 1px solid #ddd">12</td>
                    <td colspan="4" style="border-top: 1px solid #ddd">16</td>
                    <td colspan="4" style="border-top: 1px solid #ddd">20</td>
                    <td colspan="4" style="border-top: 1px solid #ddd">24</td>
                    <td colspan="3" style="border-top: 1px solid #ddd">38</td>
                    <td colspan="3" style="border-top: 1px solid #ddd">32</td>
                    <td colspan="2" style="border: 1px solid #ddd"></td>
                </tr>
                </thead>
                <tbody>
                <foreach name="wippf_resultTable_section2_1" item="table_row">
                    <tr>
                        <td class="td_section2_answer"  style="border: 1px solid #ddd;width: 5%">{$table_row.element_index}</td>
                        <td class="td_section2_answer" style="border: 1px solid #ddd">{$table_row.element_name}</td>
                        <td class="td_section2_answer" style="border: 1px solid #ddd">{$table_row.desc_level1}</td>
                        <td class="td_section2_answer" style="border: 1px solid #ddd">{$table_row.row_score}</td>

                        <foreach name="table_row['score_section']" item="score_td">
                            <td class="td_section2_score_1" style="padding: 7px 1px 1px 1px; border-bottom: 1px solid #ddd" align="center">{$score_td}</td>
                        </foreach>
                        <td class="td_section2_pname" style="border: 1px solid #ddd">{$table_row.desc_level2}</td>
                        <td class="td_section2_pname" style="border: 1px solid #ddd;width: 5%">{$table_row.element_index}</td>

                    </tr>
                </foreach>
                </tbody>


            </table>

        </div>
    </div>

</div>

</body>
<script src="__ROOT__/Public/asset/vendor/jquery-1.11.1.min.js"></script>
<script src="__ROOT__/Public/asset/bootstrap/js/bootstrap.js"></script>

<script type="text/javascript">


    $(document).ready(function(){
        function getArgs() {
            var args = {};
            var query = location.search.substring(1);
            // Get query string
            var pairs = query.split("&");
            // Break at ampersand
            for(var i = 0; i < pairs.length; i++) {
                var pos = pairs[i].indexOf('=');
                // Look for "name=value"
                if (pos == -1) continue;
                // If not found, skip
                var argname = pairs[i].substring(0,pos);// Extract the name
                var value = pairs[i].substring(pos+1);// Extract the value
                value = decodeURIComponent(value);// Decode it, if needed
                args[argname] = value;
                // Store as a property
            }
            return args;// Return the object
        }


        var arg = getArgs();

        if (arg.noline != 1){

            var canvas_html = ['<canvas id="myCanvas" width="1" height="1" style="border:1px solid #c3c3c3;"> </canvas>'];

            $("#canvas_area").html(canvas_html.join(''));

            $("#myCanvas").attr("width", document.body.scrollWidth);
            $("#myCanvas").attr("height", document.body.scrollHeight);


            // $("#myCanvas").attr("width", 2100);
            // $("#myCanvas").attr("height", 2100);

            var c=document.getElementById("myCanvas");
            var cxt=c.getContext("2d");


            //    先left再top坐标

            $(".td_score_0").each(function() {
                if ($(this).html() == '〇') {
                    cxt.moveTo($(this).offset().left + 15, $(this).offset().top + 16);
                    return false;
                }
            });
            $(".td_score_0").each(function(){
                if($(this).html() == '〇'){
                    console.log($(this).offset().left);
                    console.log($(this).offset().top);
                    cxt.lineTo($(this).offset().left + 15,$(this).offset().top + 16);
                }
            });
            cxt.stroke();


            $(".td_score_1").each(function() {
                if ($(this).html() == '〇') {
                    cxt.moveTo($(this).offset().left + 15, $(this).offset().top + 16);
                    return false;
                }
            });
            $(".td_score_1").each(function(){
                if($(this).html() == '〇'){
                    console.log($(this).offset().left);
                    console.log($(this).offset().top);
                    cxt.lineTo($(this).offset().left + 15,$(this).offset().top + 16);
                }

            });
            cxt.stroke();


            $(".td_score_2").each(function() {
                if ($(this).html() == '〇') {
                    cxt.moveTo($(this).offset().left + 15, $(this).offset().top + 16);
                    return false;
                }
            });

            $(".td_score_2").each(function(){
                if($(this).html() == '〇'){
                    console.log($(this).offset().left);
                    console.log($(this).offset().top);
                    cxt.lineTo($(this).offset().left + 15,$(this).offset().top + 16);
                }

            });

            cxt.stroke();


            $(".td_score_3").each(function() {
                if ($(this).html() == '〇') {
                    cxt.moveTo($(this).offset().left + 15, $(this).offset().top + 16);
                    return false;
                }
            });

            $(".td_score_3").each(function(){
                if($(this).html() == '〇'){
                    console.log($(this).offset().left);
                    console.log($(this).offset().top);
                    cxt.lineTo($(this).offset().left + 15,$(this).offset().top + 16);
                }

            });


            $(".td_section2_score_0").each(function() {
                if ($(this).html() == '〇') {
                    cxt.moveTo($(this).offset().left + 15, $(this).offset().top + 16);
                    return false;
                }
            });

            $(".td_section2_score_0").each(function(){
                if($(this).html() == '〇'){
                    console.log($(this).offset().left);
                    console.log($(this).offset().top);
                    cxt.lineTo($(this).offset().left + 15,$(this).offset().top + 16);
                }

            });


            $(".td_section2_score_1").each(function() {
                if ($(this).html() == '〇') {
                    cxt.moveTo($(this).offset().left + 15, $(this).offset().top + 16);
                    return false;
                }
            });

            $(".td_section2_score_1").each(function(){
                if($(this).html() == '〇'){
                    console.log($(this).offset().left);
                    console.log($(this).offset().top);
                    cxt.lineTo($(this).offset().left + 15,$(this).offset().top + 16);
                }

            });


            cxt.stroke();
        }



//    cxt.lineTo(906.5,489);
//    cxt.lineTo(728,452);
//    cxt.stroke();
//
//    alert(document.body.scrollWidth);
//    alert(document.body.scrollHeight);
//
//
//

    });


</script>
